@extends('admin.layouts.app')

@section('product','active')


@section('style')
     <!-- Bootstrap Select Css -->
    {{-- <link href="{{asset('admin/plugins/bootstrap-select/css/bootstrap-select.css')}}" rel="stylesheet" /> --}}
    
        <!-- Dropzone Css -->
        <link href="{{asset('admin/plugins/dropzone/dropzone.css')}}" rel="stylesheet">
        <!-- Bootstrap Material Datetime Picker Css -->
<link href="{{asset('admin/plugins/bootstrap-material-datetimepicker/css/bootstrap-material-datetimepicker.css')}}" rel="stylesheet" />
        <style>
        .dropzone .dz-preview {
        position: relative;
        display: inline-block;
        vertical-align: top;
        margin: 7px;
        min-height: 100px;
    }
        </style>
<!-- Jquery Core Js -->

    <script src="{{ asset('admin/plugins/jquery/jquery.min.js') }}"></script>
 <script src="{{ asset('vendor/laravel-filemanager/js/lfm.js') }}"></script>
    
@endsection

@section('content')
	
	 <div class="container-fluid">
            <div class="block-header">
                <h2>
                    商品管理
                </h2>
            </div>
            <!-- Basic Validation -->
            <div class="row clearfix">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="col-lg-7">
                        <div class="card">
                        <div class="header">
                            <h2>修改商品</h2>
                            <ul class="header-dropdown m-r--5">
                                <li class="dropdown">
                                    <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
                                        <i class="material-icons">more_vert</i>
                                    </a>
                                    <ul class="dropdown-menu pull-right">
                                        <li><a href="javascript:void(0);">返回列表</a></li>
                                        <li><a href="javascript:void(0);">重置</a></li>
                                    </ul>
                                </li>
                            </ul>
                        </div>
                        <div class="body">
                            <form id="form_validation"  action="{{ route('product.update',$product->pro_code) }}" method="POST" enctype="multipart/form-data">
                            {{csrf_field()}}
                            {{method_field('PATCH')}}
                             <ul class="nav nav-tabs tab-nav-right" role="tablist">
                                <li role="presentation" class="active"><a href="#basic" data-toggle="tab">基本信息</a></li>
                                <li role="presentation"><a href="#detail" data-toggle="tab">商品详情</a></li>

                                <li role="presentation"><a href="#attr" data-toggle="tab">商品属性</a></li>
                                <li role="presentation"><a href="#cuxiao" data-toggle="tab">促销相关</a></li>
                            </ul>

                            <!-- Tab panes -->
                            <div class="tab-content">
                                <div role="tabpanel" class="tab-pane fade in active" id="basic">
                                    
                                {{csrf_field()}}
                                <div class="form-group form-float">
                                    <select class="form-control show-tick" name="cate_id" id="cate_id">
                                        <option value="">
                                            -- 选择商品分类 --
                                        </option>
                                         @foreach($categories as $category)
                                            <option 
                                                @if($product->cate_id == $category->id) selected="selected" @endif 
                                                value="{{$category->id}}">
                                                @if($category->parent_id == 0)
                                                    {{$category->name}}
                                                @else
                                                {{str_repeat('&nbsp;',$category->level*3)}}{{$category->name}}
                                                @endif
                                            </option> 
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group form-float">
                                    <div class="form-line">
                                        <input type="text" class="form-control" name="pro_name" value="{{$product->pro_name }}" required>
                                        <label class="form-label">商品名称</label>
                                         <div class="help-info">必填:最多255字符</div>
                                    </div>
                                </div>
                                <div class="form-group form-float">
                                    <div class="form-line">
                                        <input type="text" class="form-control" name="pro_info" value="{{$product->pro_info }}"  required>
                                        <label class="form-label">商品信息</label>
                                         <div class="help-info">必填:最多255字符</div>
                                    </div>
                                </div>
                                <div class="form-group form-float">
                                    <div class="form-line">
                                        <input type="number" class="form-control" min="1" max="99999" value="{{$product->pro_prices}}" name="pro_prices"  step="0.01"  required>
                                        <label class="form-label">商品价格</label>
                                         <div class="help-info">*必填</div>
                                    </div>
                                </div>
                                <div class="form-group form-float">
                                    <div class="form-line">
                                        <input type="text" class="form-control"  value="{{$product->pro_code}}" id="pro_code" name="pro_code" required>
                                        <label class="form-label">商品编号</label>
                                    </div> 
                                     <div style="padding-top:5px;"> 
                                          <input type="checkbox" id="auto" class="filled-in" value="1" name="auto" >
                                          <label for="auto" >自动生成</label> 
                                    </div> 
                                </div> 
                                <div class="form-group form-float">
                                    <div class="form-line">
                                        <input type="text" class="form-control"  value="{{$product->pro_stock}}"  name="pro_stock" required>
                                        <label class="form-label">默认库存</label> 
                                    </div>
                                </div>
                                <div class="form-group form-float">
                                    <div class="form-line">
                                        <input type="number" class="form-control" min="1" max="99999" value="{{$product->spl_prices}}"  name="spl_prices" step="0.01" required>
                                        <label class="form-label">市场价格</label>
                                         <div class="help-info">*必填</div>
                                    </div>
                                </div>
                                <div class="form-group form-float">
                                    <div class="form-line">
                                        <input type="file" class="form-control" name="pro_img" >
                                         <div class="help-info">商品的缩略图</div>
                                         <img src="{{asset('productpics').'/'.$product->pro_img}}" width="60px" height="60px">
                                    </div>
                                </div>
                               
                                {{--
                                <div class="form-group">
                                    <input id="checkbox" name="checkbox" type="checkbox">
                                        <label for="checkbox">
                                            I have read and accept the terms
                                        </label>
                                    </input>
                                </div>
                                --}}
                                </div>
                                <div role="tabpanel" class="tab-pane fade in " id="detail">
                                  <div class="form-group form-float">
                                      <div class="form-line">
                                          <textarea name="pro_description" cols="30" rows="5"  class="form-control no-resize" id="ckeditor" required>{{$product->pro_description}}</textarea>
                                          {{-- <label class="form-label">Description</label>  --}}
                                      </div>
                                  </div>
                                </div>
                                <div role="tabpanel" class="tab-pane fade" id="attr">
                                   
                                   <div class="card">
                                          
                                           <div class="body">
                                               <div class="form-group form-float">
                                                   <select class="form-control show-tick" style="border: 1px solid #eee;" name="type_id">
                                                       <option value="">
                                                           -- 选择商品类型 --
                                                       </option>
                                                       @foreach($types as $type)
                                                       <option value="{{$type->id}}" @if($product->type_id == $type->id) selected @endif>
                                                           {{$type->type_name}}
                                                       </option>
                                                       @endforeach
                                                   </select>
                                               </div>
                                               <div  id="body-type-attr">
                                                  <p>
                                                    @include('admin.product.edit-attrs')
                                                     
                                                  </p>
                                               </div>
                                           </div>
                                       </div>
                                     </div>  
                                <div role="tabpanel" class="tab-pane fade" id="cuxiao">
                                    <div class="card " style="">
                                        <div class="header">
                                            <h2>
                                                其他信息
                                            </h2>
                                        </div>
                                        <div class="body">
                                            <input class="filled-in" id="cuxiaos" name="is_promote" type="checkbox" value="1" @if($product->is_promote) checked @endif>
                                               <label for="cuxiaos">
                                                   开启促销
                                               </label>
                                           </input>
                                            <div class="form-group form-float">

                                                <div class="form-line">
                                                
                                                    <input class="form-control promote_price" disabled="disabled" max="99999" min="0" name="promote_price" disabled required="" type="number" value="0.00">
                                                        <label class="form-label">
                                                            促销价格
                                                        </label>

                                                </div>
                                            </div>

                                             <b>
                                                开始时间
                                            </b>
                                             <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="material-icons">
                                                        date_range
                                                    </i>
                                                </span>
                                                <div class="form-line">
                                                    <input value="@if($product->promote_start_time) {{date('Y-m-d H:i:s',$product->promote_start_time)}} @else {{date('Y-m-d H:i:s')}} @endif" class="datetimepicker promote_price form-control datetime" disabled="disabled" name="promote_start_time" placeholder="格式 {{date('Y-m-d H:i:s')}}" type="text">
                                                    </input>
                                                </div>
                                            </div>
                                            <b>
                                                结束时间
                                            </b>
                                            <div class="input-group">
                                                <span class="input-group-addon">
                                                    <i class="material-icons">
                                                        date_range
                                                    </i>
                                                </span>
                                                <div class="form-line">
                                                    <input value="@if($product->promote_end_time) {{ date('Y-m-d H:i:s',$product->promote_end_time)}} @else {{date('Y-m-d H:i:s')}} @endif" class="datetimepicker promote_price form-control datetime" disabled="disabled" name="promote_end_time" placeholder="格式 {{date('Y-m-d H:i:s')}}" type="text">
                                                    </input>
                                                </div></div>
                                        </div> 
                                        <div class="card " style="">
                                        <div class="header">
                                            <h2>
                                                推荐
                                            </h2>
                                        </div>
                                        <div class="body">
                                            <p>
                                                  <input type="checkbox" id="test6" class="mr-2" @if($product->is_hot) checked @endif value="1" name="is_hot" />
                                                  <label for="test6">热门</label>
                                                  <input type="checkbox" id="test7" class="mr-2" @if($product->is_new) checked @endif value="1" name="is_new" />
                                                  <label for="test7">新品</label>
                                                  <input type="checkbox" id="test8" class="mr-2"@if($product->is_best) checked @endif value="1" name="is_best" />
                                                  <label for="test8">精品</label>
                                           </p>
                                        </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="form-group">
                                   <input class="filled-in" id="is_floor" name="is_floor" type="checkbox" value="1" @if($product->is_floor) checked  @endif>
                                            <label for="is_floor">
                                                首页楼层推荐
                                            </label>
                                        </input>
                                </div>
                               
                                <button class="btn btn-primary waves-effect" id="sub" type="submit">
                                    SUBMIT
                                </button>
                            </form>

                            </div>
                          </div></div></div>
                    <div class="col-lg-5">
                         <div class="row"> 
                             <div class="col-lg-12">
                               
                                       <div class="card " style="">
                                     <div class="header">
                                         <h2>商品子图</h2> 
                                     </div>
                                     <div class="body">
                                        <form action="{{ route('upload',[0,$product->pro_code]) }}"  method="post" id="frmFileUpload" class="dropzone" method="post" enctype="multipart/form-data">
                                            {{csrf_field()}}

                                            <div class="dz-message text-center">
                                                <div class="drag-icon-cph">
                                                    <i class="material-icons">touch_app</i>
                                                </div>
                                                <h3>点击或拖拽上传</h3>
                                            </div>
                                            <div class="fallback">
                                                <input name="file" type="file" multiple />
                                            </div>
                                        </form>
                                        <div>
                                            @foreach ($product->images as $image)
                                            <div class="">
                                                <div class="thumbnail ">
                                                    <img src="{{url($image->image_path)}}">
                                                </div>
                                            </div>
                                            @endforeach
                                        </div>
                                     </div>
                                 </div>
                             </div>
                         </div>
                    </div>
                   

                    </div>
                    
                </div>
                </div>
            </div>
            <!-- #END# Basic Validation -->
     </div>


@endsection

@section('js-script')
	{{-- expr --}}
	

    <!-- Bootstrap Core Js -->
    <script src="{{ asset('admin/plugins/bootstrap/js/bootstrap.js') }}"></script>

    <!-- Select Plugin Js -->
    {{-- <script src="{{ asset('admin/plugins/bootstrap-select/js/bootstrap-select.js') }}"></script> --}}

    <!-- Slimscroll Plugin Js -->
    <script src="{{ asset('admin/plugins/jquery-slimscroll/jquery.slimscroll.js') }}"></script>

    <!-- Waves Effect Plugin Js -->
    <script src="{{ asset('admin/plugins/node-waves/waves.js') }}"></script>
    {{-- <script src="{{asset('admin/plugins/ckeditor/ckeditor.js')}}"></script> --}}

    <script src="https://cdn.bootcss.com/ckeditor/4.7.3/ckeditor.js"></script>
    <script src="https://cdn.bootcss.com/ckeditor/4.7.3/adapters/jquery.js"></script>




    <!-- Jquery CountTo Plugin Js -->
    <script src="{{ asset('admin/plugins/jquery-countto/jquery.countTo.js') }}"></script>

    <!-- Morris Plugin Js -->
    <script src="{{ asset('admin/plugins/raphael/raphael.min.js') }}"></script>
    <script src="{{ asset('admin/plugins/morrisjs/morris.js') }}"></script>
    <script src="{{asset('admin/plugins/dropzone/dropzone.js')}}"></script>
    <!-- Bootstrap Material Datetime Picker Plugin Js -->
    <script src="{{asset('admin/plugins/momentjs/moment.js')}}"></script>
    <script src="http://momentjs.cn/downloads/moment-with-locales.min.js"></script>
    <script src="{{asset('admin/plugins/bootstrap-material-datetimepicker/js/bootstrap-material-datetimepicker.js')}}"></script>
    <script>
     $(function(){
            //Datetimepicker plugin
        moment().locale('zh-cn'); 
        $('.datetimepicker').bootstrapMaterialDatePicker({
             lang : 'zh-cn', 
             format:('YYYY-M-D H:mm:ss'),
            clearButton: true,
            weekStart: 1,
            cancelText : '取消'
        });
     })
    </script>
    <script src="{{ asset('admin/js/pages/forms/advanced-form-elements.js')}}"></script>

    <script src="{{ asset('admin/js/pages/ui/modals.js') }}"></script>
     <script>
   var route_prefix = "{{ url(config('lfm.prefix')) }}";
  </script>
  <script>
    $('textarea[name=pro_description]').ckeditor({
      height: 300,
      filebrowserImageBrowseUrl: route_prefix + '?type=Images',
      filebrowserImageUploadUrl: route_prefix + '/upload?type=Images&_token={{csrf_token()}}',
      filebrowserBrowseUrl: route_prefix + '?type=Files',
      filebrowserUploadUrl: route_prefix + '/upload?type=Files&_token={{csrf_token()}}'
    });
  </script>


 

    <!-- Custom Js -->
    <script src="{{ asset('admin/js/admin.js') }}"></script>

    <!-- Demo Js -->
    <script src="{{ asset('admin/js/demo.js') }}"></script>
    <script type="text/javascript">
      @if(empty($attributes))
        $("select[name=type_id]").trigger("change");
      @endif
      $(function(){
            $("select[name=type_id]").change(function(){
                       $("#body-type-attr").empty()
                var id = $(this).val();
                $.getJSON("{{ url('admin/attributes') }}"+"/"+id,function(res){
                       var html = '';
                        html+= '<p>';

                    $(res).each(function(k,v){
                        html += '<div class="form-group form-float"><div class="form-line"><label style="margin-top:10px">'+v.attr_name+'</label>';

                        if(v.attr_type == 1){
                            html += '<a onclick="addnew(this)" href="javascript:void(0)">[+]</a>';
                        }
                        if(v.attr_option_values == null){
                            html += '<input type="text" class="form-control" name="ga['+v.id+'][]" placeholder="'+v.attr_name+'"/>'
                        }
                        // html += '';

                        else
                        {
                            html += '<div class="row">'
                             html += '<div class="col-lg-4"><select name="ga['+v.id+'][]" class="form-control show-tick">';
                                    var opts = v.attr_option_values.split('|');
                                    html += '<option value="">请选择</option>'
                                        // console.log(opts);

                                    for(var i=0; i<opts.length; i++){
                                     html += '<option value="'+opts[i]+'">'+opts[i]+'</option>'

                                    }
                                html += '</select></div>'

                        } 
                        if(v.attr_type == 1){
                            html += '<div class="col-lg-5"><input type="text" name="attr_price['+v.id+'][]" class="form-control" style="border-bottom:1px solid #aaa;" placeholder="价格"/></div>'
                        }
                        html += '</div>';
                        html += '</div>';
                        html += '</div>'
                        html += '</p>'
                    })
                 $("#body-type-attr").html(html);

                })
                // alert();
            })
        })
       function addnew(a){
           var div =  $(a).parent();
           if($(a).html() == '[+]')
           {
            var newDiv = div.clone();
            //判断是否是新的，是去掉old_
            var old = newDiv.find('select').attr('name');
            var newName = old.replace('old_','');
            newDiv.find('select').attr('name',newName);
            //input 
            var old_i = newDiv.find('input').attr('name');
            var newNamei = old_i.replace('old_','');
            newDiv.find('input').attr('name',newNamei);

            newDiv.find("a").html("[-]");
            div.after(newDiv);
           }
           else{

            //ajax删除属性
            if(confirm('确定要删除吗?')){
              var gaid = $(a).attr('attr-gaid');
              $.get('{{ url('admin/attributes/del/') }}'+'/'+gaid,function(rsp){
                console.log(rsp)
              })
              div.remove();
            }
            
           }
           // console.log(div);
        } 

    	$(function(){
            var code = $("#pro_code").val();

            if($("#cuxiaos").attr('checked')){
                    $(".promote_price").removeAttr('disabled');
                }

                $("#cuxiaos").click(function(){
                     
                     if($("#cuxiaos").attr('checked'))
                     {
                        $("#cuxiaos").removeAttr('checked');
                        $(".promote_price").attr('disabled','disabled');
                     }else{
                        $(".promote_price").removeAttr('disabled');
                        
                        $("#cuxiaos").attr('checked','checked');
                     }


                })

	    		if($("#auto").attr('checked')){
	    			$("#pro_code").attr('disabled','disabled');
	    		}
	    		$("#auto").click(function(){
	    			 
	    			 if($("#auto").attr('checked'))
	    			 {
	    			 	$("#auto").removeAttr('checked');
	    			 	$("#pro_code").removeAttr('disabled');
                        $("#pro_code").val(code);

	    			 }else{
              $("#pro_code").attr('disabled','disabled');
	    				$("#pro_code").val('');
	    				$("#auto").attr('checked','checked');
	    			 }


	    		})

		}); 
    	
    </script>
@endsection